import React from "react";
import GoBack from "@/components/TheGoBack";
import { Form, DatePicker, Button, Space } from "antd";
import ThePagination from "@/components/ThePagination";
import TheTable from "@/components/TheTable";

const { RangePicker } = DatePicker;
const Search = ({}) => {
  const reset = () => {};
  return (
    <div className="p-search-box" style={{ marginTop: 20 }}>
      <Form layout="inline">
        <Form.Item label="核销时间">
          <RangePicker />
        </Form.Item>
        <Form.Item>
          <Space size="small" style={{ marginLeft: 10 }}>
            <Button type="primary" htmlType="submit">
              查询
            </Button>
            <Button onClick={reset}>重置</Button>
          </Space>
        </Form.Item>
      </Form>
    </div>
  );
};

class Record extends React.Component {
  state = {
    columns: [
      {
        title: "订单编号",
        dataIndex: "",
        key: "",
      },
      {
        title: "核销时间",
        dataIndex: "",
        key: "",
      },
    ],
    dataSource: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
    pageData: {
      pageNo: 1,
      pageSize: 10,
    },
    total: 500,
  };
  pageChange = (arg) => {
    console.log(arg);
  };
  render() {
    const {
      columns,
      dataSource,
      pageData: { pageNo, pageSize },
      total,
    } = this.state;
    return (
      <div className="p-layout-box commodity-list-evaluate">
        <GoBack history={this.props.history} title={"查看评论"} />
        <Search />
        <div className="p-layout-content-pagination">
          <TheTable
            columns={columns}
            dataSource={dataSource}
            scroll={{ x: "max-content", y: 440 }}
          />
          <ThePagination
            pageNo={pageNo}
            pageSize={pageSize}
            total={total}
            pageChange={this.pageChange}
          />
        </div>
      </div>
    );
  }
}

export default Record;
